<div style="overflow-x: hidden;">
    <ul class="nav nav-tabs" id="myTab">
        <li style="width: 200px; text-align: center;" class="active">
            <a href="#regionalBuildingState" id="regionalBuildinglab" role="tab" data-toggle="tab">地区建筑物总数统计</a>
        </li>
        <li style="width: 200px; text-align: center;" >
            <a href="#structTypeState" id="structTypelab" role="tab" data-toggle="tab">结构类型占比统计</a>
        </li>
        <li style="width: 200px; text-align: center;">
            <a href="#ageBuildState" id="ageBuildlab" role="tab" data-toggle="tab">建造年代占比统计</a>
        </li>
        <li style="width: 200px; text-align: center;">
            <a href="#earthquakeState" id="earthquakelab" role="tab" data-toggle="tab">抗震设防烈度占比统计</a>
        </li>
        <li style="width: 200px; text-align: center;">
            <a href="#earthquakeSituationState" id="earthquakeSituationlab" role="tab" data-toggle="tab">抗震设防情况统计</a>
        </li>
        <li style="width: 200px; text-align: center;">
            <a href="#ruralHouseState" id="ruralHouselab" role="tab" data-toggle="tab">农村居住房屋使用情况统计</a>
        </li>
        <li style="width: 245px; text-align: center;">
            <a href="#ruralEarthquakeState" id="ruralEarthquakelab" role="tab" data-toggle="tab">农村居住房屋抗震构造措施占比统计</a>
        </li>
        <li style="width: 200px; text-align: center;">
            <a href="#hiddenDangerState" id="hiddenDangerlab" role="tab" data-toggle="tab">存在安全隐患占比统计</a>
        </li>
    </ul>

    <div style="margin-top: 8px;">
        <form id="searchForm" name="searchForm" style="padding: 20px 0;margin: 0 10px;border-bottom: 1px solid #ddd;">
            <div class="row">
                <div class="col-md-4 form-horizontal">
                    <div class="form-group">
                        <label class="col-md-3 control-label"> </span>所属地区:</label>
                        <div class="col-md-9">
                            <input id="province" class="easyui-combobox" style="width: 110px;" />
                            <input id="city" class="easyui-combobox" style="width: 110px;"/>
                            <input id="county" class="easyui-combobox" style="width: 110px;" />
                        </div>
                    </div>
                </div>
                <div class="col-md-3 form-horizontal">
                    <div class="form-group">
                        <label class="col-md-3 control-label"> </span>数据对象:</label>
                        <div class="col-md-9">
                            <input id="objectAnalysis" class="easyui-combobox" style="width: 110px;" />
                        </div>
                    </div>
                </div>
                <button id="btnSearch" class="btn btn-default" type="button">查询</button>
                <button id="btnReset" class="btn btn-default" type="button">重置</button>
            </div>
        </form>
    </div>
    <div class="tab-content" style="margin-top: 20px;">
        <div class="tab-pane fade in active" id="regionalBuildingState" style="width: 100%;text-align: center;">
            <div id="buildings" style="display: inline-block;width: 47%; height: 600px; margin: 0 auto;"></div>
            <div id="buildingArea" style="display: inline-block;width: 47%; height: 600px; margin: 0 auto"></div>
        </div>
        <div class="tab-pane fade" id="structTypeState" style="width: 100%;position: relative;text-align: center;">
            <div id="cityBuildings" style="display: inline-block;width: 47%; height: 600px; margin: 0 auto;"></div>
            <div id="ruralBuildings" style="display: inline-block;width: 47%; height: 600px; margin: 0 auto;"></div>
            <div style="position: absolute;left: 3%;top: 15%;text-align: right;">
                <span style="font-size: 20px;">总面积<br>面积</span>
            </div>
            <div style="position: absolute;left: 26%;top: 15%;text-align: right;">
                <span style="font-size: 20px;">总栋数<br>栋数</span>
            </div>
            <div style="position: absolute;left: 53%;top: 15%;text-align: right;">
                <span style="font-size: 20px;">总面积<br>面积</span>
            </div>
            <div style="position: absolute;left: 73%;top: 15%;text-align: right;">
                <span style="font-size: 20px;">总栋数<br>栋数</span>
            </div>
        </div>
        <div class="tab-pane fade" id="ageBuildState" style="width: 100%;text-align: center;">
            <div id="ageBuildings" style="display: inline-block;width: 94%; height: 600px; margin: 0 auto;"></div>
        </div>
        <div class="tab-pane fade" id="earthquakeState" style="width: 100%;text-align: center;">
            <div id="earthquake" style="display: inline-block;width: 94%; height: 600px; margin: 0 auto;"></div>
        </div>
        <div class="tab-pane fade" id="earthquakeSituationState" style="width: 100%;text-align: center;">
            <div id="earthquakeSituation" style="display: inline-block;width: 94%; height: 600px; margin: 0 auto;"></div>
        </div>
        <div class="tab-pane fade" id="ruralHouseState" style="width: 100%;text-align: center;">
            <div id="ruralHouse" style="display: inline-block;width: 94%; height: 600px; margin: 0 auto;"></div>
        </div>
        <div class="tab-pane fade" id="ruralEarthquakeState" style="width: 100%;text-align: center;">
            <div id="ruralEarthquake" style="display: inline-block;width: 94%; height: 600px; margin: 0 auto;"></div>
        </div>
        <div class="tab-pane fade" id="hiddenDangerState" style="width: 100%;text-align: center;">
            <div id="hiddenDanger" style="display: inline-block;width: 94%; height: 600px; margin: 0 auto;"></div>
        </div>
    </div>
</div>